<!DOCTYPE html>
<html lang="en">

  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Meta -->
    <meta name="description" content="Best Bootstrap Admin Dashboards">
    <meta name="author" content="Bootstrap Gallery">
    

    <meta property="og:title" content="Admin Templates - Dashboard Templates | Bootstrap Gallery">
    <meta property="og:description" content="Marketplace for Bootstrap Admin Dashboards">
    <meta property="og:type" content="Website">
    <meta property="og:site_name" content="Bootstrap Gallery">
    <link rel="shortcut icon" href="assets/images/favicon.svg">

    <!-- Title -->
    <title>Bootstrap Gallery - Elite Admin Dashboard Template</title>

    <!-- *************
			************ Common Css Files *************
		************ -->
    <!-- Bootstrap css -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">

    <!-- Bootstrap font icons css -->
    <link rel="stylesheet" href="assets/fonts/bootstrap/bootstrap-icons.css">

    <!-- Main css -->
    <link rel="stylesheet" href="assets/css/main.min.css">

    <!-- *************
			************ Vendor Css Files *************
		************ -->

    <!-- Scrollbar CSS -->
    <link rel="stylesheet" href="assets/vendor/overlay-scroll/OverlayScrollbars.min.css">

    <!-- Date Range CSS -->
    <link rel="stylesheet" href="assets/vendor/daterange/daterange.css">

    <!-- Dropzone CSS -->
    <link rel="stylesheet" href="assets/vendor/dropzone/dropzone.min.css">
  </head>

  <body>

    <!-- Page wrapper start -->
    <div class="page-wrapper">

      <!-- Page header starts -->
      <div class="page-header">

        <!-- Sidebar brand starts -->
        <div class="brand">
          <a href="index.html" class="logo">
            <img src="assets/images/logo.svg" class="d-none d-md-block me-4" alt="Admin Dashboards">
            <img src="assets/images/logo-sm.svg" class="d-block d-md-none me-4" alt="Admin Dashboards">
          </a>
        </div>
        <!-- Sidebar brand ends -->

        <div class="toggle-sidebar" id="toggle-sidebar">
          <i class="bi bi-list"></i>
        </div>

        <!-- Header actions ccontainer start -->
        <div class="header-actions-container">

          <!-- Search container start -->
          <div class="search-container me-4 d-xl-block d-lg-none">

            <!-- Search input group start -->
            <div class="input-group">
              <input type="text" class="form-control" id="searchAny" placeholder="Search">
              <button class="btn btn-outline-secondary" type="button">
                <i class="bi bi-search"></i>
              </button>
            </div>
            <!-- Search input group end -->

          </div>
          <!-- Search container end -->

          <!-- Header actions start -->
          <div class="header-actions d-xl-flex d-lg-none gap-4">
            <div class="dropdown">
              <a class="dropdown-toggle" href="#!" role="button" data-bs-toggle="dropdown" aria-expanded="false">
                <i class="bi bi-envelope-open fs-5 lh-1"></i>
                <span class="count-label">9</span>
              </a>
              <div class="dropdown-menu dropdown-menu-end shadow-lg">
                <div class="dropdown-item">
                  <div class="d-flex py-2 border-bottom">
                    <img src="assets/images/user.png" class="img-3x me-3 rounded-3" alt="Admin Dashboards">
                    <div class="m-0">
                      <h6 class="mb-1 fw-semibold">Sophie Michiels</h6>
                      <p class="mb-1">Membership has been ended.</p>
                      <p class="small m-0 text-secondary">Today, 07:30pm</p>
                    </div>
                  </div>
                </div>
                <div class="dropdown-item">
                  <div class="d-flex py-2 border-bottom">
                    <img src="assets/images/user2.png" class="img-3x me-3 rounded-3" alt="Admin Dashboards">
                    <div class="m-0">
                      <h6 class="mb-1 fw-semibold">Benjamin Michiels</h6>
                      <p class="mb-1">Congratulate, James for new job.</p>
                      <p class="small m-0 text-secondary">Today, 08:00pm</p>
                    </div>
                  </div>
                </div>
                <div class="dropdown-item">
                  <div class="d-flex py-2">
                    <img src="assets/images/user1.png" class="img-3x me-3 rounded-3" alt="Admin Dashboards">
                    <div class="m-0">
                      <h6 class="mb-1 fw-semibold">Jehovah Roy</h6>
                      <p class="mb-1">Lewis added new schedule release.</p>
                      <p class="small m-0 text-secondary">Today, 09:30pm</p>
                    </div>
                  </div>
                </div>
                <div class="d-grid mx-3 my-1">
                  <a href="javascript:void(0)" class="btn btn-primary">View all</a>
                </div>
              </div>
            </div>
            <a href="accountSettings.html" data-bs-toggle="tooltip" data-bs-placement="bottom"
               data-bs-custom-class="custom-tooltip-blue" data-bs-title="Settings">
              <i class="bi bi-gear font-1xx"></i>
            </a>
          </div>
          <!-- Header actions start -->

          <!-- Header profile start -->
          <div class="header-profile d-flex align-items-center">
            <div class="dropdown">
              <a href="#" id="userSettings" class="user-settings" data-toggle="dropdown" aria-haspopup="true">
                <span class="user-name d-none d-md-block">Michelle White</span>
                <span class="avatar">
                  <img src="assets/images/user2.png" alt="Admin Templates">
                  <span class="status online"></span>
                </span>
              </a>
              <div class="dropdown-menu dropdown-menu-end" aria-labelledby="userSettings">
                <div class="header-profile-actions">
                  <a href="profile.html">Profile</a>
                  <a href="accountSettings.html">Settings</a>
                  <a href="login.html">Logout</a>
                </div>
              </div>
            </div>
          </div>
          <!-- Header profile end -->

        </div>
        <!-- Header actions ccontainer end -->

      </div>
      <!-- Page header ends -->

      <!-- Main container start -->
      <div class="main-container">

        <!-- Sidebar wrapper start -->
        <nav class="sidebar-wrapper">

          <!-- Sidebar custom nav starts -->
          <div class="sidebar-custom-nav">
            <a href="support.html">
              <i class="bi bi-headset"></i>
              <span>Support</span>
            </a>
            <a href="subscribers.html">
              <i class="bi bi-bar-chart-line"></i>
              <span>Subscribers</span>
            </a>
            <a href="accountSettings.html">
              <i class="bi bi-gear"></i>
              <span>Settings</span>
            </a>
            <a href="invoiceList.html">
              <i class="bi bi-graph-up-arrow"></i>
              <span>Invoices</span>
            </a>
          </div>
          <!-- Sidebar custom nav end -->

          <!-- Sidebar menu starts -->
          <div class="sidebar-menu">
            <div class="sidebarMenuScroll">
              <ul>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-house"></i>
                    <span class="menu-text">Dashboards</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="index.html">Analytics</a>
                      </li>
                      <li>
                        <a href="dashboard2.html">Sales</a>
                      </li>
                      <li>
                        <a href="dashboard3.html">CRM</a>
                      </li>
                      <li>
                        <a href="dashboard4.html">Projects</a>
                      </li>
                      <li>
                        <a href="dashboard5.html">Statistics</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li>
                  <a href="widgets.html">
                    <i class="bi bi-box"></i>
                    <span class="menu-text">Widgets</span>
                  </a>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-collection"></i>
                    <span class="menu-text">UI Elements</span>
                    <span class="badge red">15</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="accordions.html">Accordions</a>
                      </li>
                      <li>
                        <a href="alerts.html">Alerts</a>
                      </li>
                      <li>
                        <a href="buttons.html">Buttons</a>
                      </li>
                      <li>
                        <a href="badges.html">Badges</a>
                      </li>
                      <li>
                        <a href="cards.html">Cards</a>
                      </li>
                      <li>
                        <a href="advanced-cards.html">Advanced Cards</a>
                      </li>
                      <li>
                        <a href="carousel.html">Carousel</a>
                      </li>
                      <li>
                        <a href="dropdowns.html">Dropdowns</a>
                      </li>
                      <li>
                        <a href="icons.html">Icons</a>
                      </li>
                      <li>
                        <a href="list-items.html">List Items</a>
                      </li>
                      <li>
                        <a href="modals.html">Modals</a>
                      </li>
                      <li>
                        <a href="offcanvas.html">Off Canvas</a>
                      </li>
                      <li>
                        <a href="progress.html">Progress Bars</a>
                      </li>
                      <li>
                        <a href="spinners.html">Spinners</a>
                      </li>
                      <li>
                        <a href="tabs.html">Tabs</a>
                      </li>
                      <li>
                        <a href="tooltips.html">Tooltips</a>
                      </li>
                      <li>
                        <a href="typography.html">Typography</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown active">
                  <a href="#">
                    <i class="bi bi-stickies"></i>
                    <span class="menu-text">Pages</span>
                    <span class="badge blue">8</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="support.html">Support</a>
                      </li>
                      <li>
                        <a href="create-invoice.html">Create Invoice</a>
                      </li>
                      <li>
                        <a href="view-invoice.html">View Invoice</a>
                      </li>
                      <li>
                        <a href="invoiceList.html">Invoice List</a>
                      </li>
                      <li>
                        <a href="subscribers.html">Subscribers</a>
                      </li>
                      <li>
                        <a href="contacts.html">Contacts</a>
                      </li>
                      <li>
                        <a href="pricing.html">Pricing</a>
                      </li>
                      <li>
                        <a href="profile.html">Profile</a>
                      </li>
                      <li>
                        <a href="starter-page.html">Starter Page</a>
                      </li>
                      <li>
                        <a href="starter-page-no-quick-menu.html">No Quick Menu</a>
                      </li>
                      <li>
                        <a href="accountSettings.html" class="current-page">Account Settings</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-calendar4"></i>
                    <span class="menu-text">Events</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="events.html">Events List</a>
                      </li>
                      <li>
                        <a href="calendar.html">Daygrid</a>
                      </li>
                      <li>
                        <a href="calendar-draggable.html">External Draggable</a>
                      </li>
                      <li>
                        <a href="calendar-google.html">Google Calendar</a>
                      </li>
                      <li>
                        <a href="calendar-list-view.html">List View</a>
                      </li>
                      <li>
                        <a href="calendar-selectable.html">Selectable</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-columns-gap"></i>
                    <span class="menu-text">Forms</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="form-inputs.html">Form Inputs</a>
                      </li>
                      <li>
                        <a href="form-checkbox-radio.html">Checkbox &amp; Radio</a>
                      </li>
                      <li>
                        <a href="form-file-input.html">File Input</a>
                      </li>
                      <li>
                        <a href="form-validations.html">Validations</a>
                      </li>
                      <li>
                        <a href="date-time-pickers.html">Date Time Pickers</a>
                      </li>
                      <li>
                        <a href="input-mask.html">Input Masks</a>
                      </li>
                      <li>
                        <a href="form-layouts.html">Form Layouts</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-window-split"></i>
                    <span class="menu-text">Tables</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="tables.html">Tables</a>
                      </li>
                      <li>
                        <a href="data-tables.html">Data Tables</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-map"></i>
                    <span class="menu-text">Graphs &amp; Maps</span>
                    <span class="badge green">15</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="apex.html">Apex</a>
                      </li>
                      <li>
                        <a href="morris.html">Morris</a>
                      </li>
                      <li>
                        <a href="maps.html">Maps</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-layout-sidebar"></i>
                    <span class="menu-text">Layouts</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="layout.html">Default Layout</a>
                      </li>
                      <li>
                        <a href="layout-grid.html">Grid Layout</a>
                      </li>
                      <li>
                        <a href="layout-mega-menu.html">Mega Menu</a>
                      </li>
                      <li>
                        <a href="layout-full-screen.html">Full Screen</a>
                      </li>
                      <li>
                        <a href="hero-header.html">Hero Header</a>
                      </li>
                      <li>
                        <a href="layout-datepicker.html">Layout Datepicker</a>
                      </li>
                      <li>
                        <a href="sidebar-quick-links.html">Sidebar Quick Links</a>
                      </li>
                      <li>
                        <a href="layout-welcome.html">Welcome Layout</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li class="sidebar-dropdown">
                  <a href="#">
                    <i class="bi bi-upc-scan"></i>
                    <span class="menu-text">Authentication</span>
                  </a>
                  <div class="sidebar-submenu">
                    <ul>
                      <li>
                        <a href="login.html">Login</a>
                      </li>
                      <li>
                        <a href="signup.html">Signup</a>
                      </li>
                      <li>
                        <a href="forgot-password.html">Forgot Password</a>
                      </li>
                      <li>
                        <a href="error.html">Error</a>
                      </li>
                      <li>
                        <a href="maintenance.html">Maintenance</a>
                      </li>
                    </ul>
                  </div>
                </li>
                <li>
                  <a href="support.html">
                    <i class="bi bi-code-square"></i>
                    <span class="menu-text">Support</span>
                  </a>
                </li>
              </ul>
            </div>
          </div>
          <!-- Sidebar menu ends -->

        </nav>
        <!-- Sidebar wrapper end -->

        <!-- Content wrapper scroll start -->
        <div class="content-wrapper-scroll">

          <!-- Main header starts -->
          <div class="main-header d-flex align-items-center justify-content-between position-relative">
            <div class="d-flex align-items-center justify-content-center">
              <div class="page-icon pe-3">
                <i class="bi bi-stickies"></i>
              </div>
              <div class="page-title d-none d-md-block">
                <h5>Account Settings</h5>
              </div>
            </div>
            <!-- Live updates start -->
            <ul class="updates d-flex align-items-end flex-column overflow-hidden" id="updates">
              <li>
                <a href="javascript:void(0)">
                  <i class="bi bi-envelope-paper text-red font-1x me-2"></i>
                  <span>12 emails from David Michaiah.</span>
                </a>
              </li>
              <li>
                <a href="javascript:void(0)">
                  <i class="bi bi-bar-chart text-blue font-1x me-2"></i>
                  <span>15 new features updated successfully.</span>
                </a>
              </li>
              <li>
                <a href="javascript:void(0)">
                  <i class="bi bi-folder-check text-yellow font-1x me-2"></i>
                  <span>The media folder is created successfully.</span>
                </a>
              </li>
            </ul>
            <!-- Live updates end -->
          </div>
          <!-- Main header ends -->

          <!-- Content wrapper start -->
          <div class="content-wrapper">
            <div class="subscribe-header">
              <img src="assets/images/bg.jpg" class="img-fluid w-100" alt="Admin & Dashboards">
            </div>
            <div class="subscriber-body">
              <!-- Row start -->
              <div class="row justify-content-center mt-4">
                <div class="col-lg-12">
                  <!-- Row start -->
                  <div class="row align-items-end">
                    <div class="col-auto">
                      <img src="assets/images/user2.png" class="img-7xx rounded-circle">
                    </div>
                    <div class="col">
                      <h6>Admin</h6>
                      <h4 class="m-0">David Michaiah</h4>
                    </div>
                    <div class="col-12 col-md-auto">
                      <span class="badge shade-green">79% Completed</span>
                    </div>
                  </div>
                  <!-- Row end -->
                </div>
              </div>
              <!-- Row end -->

              <!-- Row start -->
              <div class="row justify-content-center mt-4">
                <div class="col-lg-12">
                  <div class="card light">
                    <div class="card-body">
                      <div class="custom-tabs-container">
                        <ul class="nav nav-tabs" id="customTab2" role="tablist">
                          <li class="nav-item" role="presentation">
                            <a class="nav-link active" id="tab-oneA" data-bs-toggle="tab" href="#oneA" role="tab"
                              aria-controls="oneA" aria-selected="true">General</a>
                          </li>
                          <li class="nav-item" role="presentation">
                            <a class="nav-link" id="tab-twoA" data-bs-toggle="tab" href="#twoA" role="tab"
                              aria-controls="twoA" aria-selected="false">Settings</a>
                          </li>
                          <li class="nav-item" role="presentation">
                            <a class="nav-link" id="tab-threeA" data-bs-toggle="tab" href="#threeA" role="tab"
                              aria-controls="threeA" aria-selected="false">Credit Cards</a>
                          </li>
                        </ul>
                        <div class="tab-content h-350">
                          <div class="tab-pane fade show active" id="oneA" role="tabpanel">
                            <!-- Row start -->
                            <div class="row gx-3">
                              <div class="col-sm-4 col-12">
                                <div id="update-profile" class="mb-3">
                                  <form action="/upload" class="dropzone sm needsclick dz-clickable"
                                    id="update-profile-pic">
                                    <div class="dz-message needsclick">
                                      <button type="button" class="dz-button">
                                        Update Image.
                                      </button>
                                    </div>
                                  </form>
                                </div>
                              </div>
                              <div class="col-sm-8 col-12">
                                <div class="row gx-3">
                                  <div class="col-6">
                                    <!-- Form Field Start -->
                                    <div class="mb-3">
                                      <label for="fullName" class="form-label">Full Name</label>
                                      <input type="text" class="form-control" id="fullName" placeholder="Full Name">
                                    </div>

                                    <!-- Form Field Start -->
                                    <div class="mb-3">
                                      <label for="contactNumber" class="form-label">Contact</label>
                                      <input type="text" class="form-control" id="contactNumber" placeholder="Contact">
                                    </div>
                                  </div>
                                  <div class="col-6">
                                    <!-- Form Field Start -->
                                    <div class="mb-3">
                                      <label for="emailId" class="form-label">Email</label>
                                      <input type="email" class="form-control" id="emailId" placeholder="Email ID">
                                    </div>

                                    <!-- Form Field Start -->
                                    <div class="mb-3">
                                      <label for="birthDay" class="form-label">Birthday</label>
                                      <div class="input-group">
                                        <input type="text" class="form-control datepicker-opens-left" id="birthDay"
                                          placeholder="DD/MM/YYYY">
                                        <span class="input-group-text">
                                          <i class="bi bi-calendar4"></i>
                                        </span>
                                      </div>
                                    </div>
                                  </div>
                                  <div class="col-12">
                                    <!-- Form Field Start -->
                                    <div class="mb-3">
                                      <label class="form-label">About</label>
                                      <textarea class="form-control" rows="3"></textarea>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                            <!-- Row end -->
                          </div>
                          <div class="tab-pane fade" id="twoA" role="tabpanel">
                            <div class="card-body">
                              <!-- Row start -->
                              <div class="row gx-3">
                                <div class="col-sm-6 col-12">
                                  <!-- Card start -->
                                  <div class="card">
                                    <div class="card-body">
                                      <ul class="list-group">
                                        <li class="list-group-item d-flex justify-content-between align-items-center">
                                          Show desktop notifications
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="switchOne">
                                          </div>
                                        </li>
                                        <li class="list-group-item d-flex justify-content-between align-items-center">
                                          Show email notifications
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch" id="switchTwo"
                                              checked />
                                          </div>
                                        </li>
                                        <li class="list-group-item d-flex justify-content-between align-items-center">
                                          Show chat notifications
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="switchThree">
                                          </div>
                                        </li>
                                      </ul>
                                    </div>
                                  </div>
                                  <!-- Card end -->
                                </div>
                                <div class="col-sm-6 col-12">
                                  <!-- Card start -->
                                  <div class="card">
                                    <div class="card-body">
                                      <ul class="list-group">
                                        <li class="list-group-item d-flex justify-content-between align-items-center">
                                          Show purchase history
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="switchFour">
                                          </div>
                                        </li>
                                        <li class="list-group-item d-flex justify-content-between align-items-center">
                                          Show orders
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="switchFive">
                                          </div>
                                        </li>
                                        <li class="list-group-item d-flex justify-content-between align-items-center">
                                          Show alerts
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="switchSix">
                                          </div>
                                        </li>
                                      </ul>
                                    </div>
                                  </div>
                                  <!-- Card end -->
                                </div>
                              </div>
                              <!-- Row end -->
                            </div>
                          </div>
                          <div class="tab-pane fade" id="threeA" role="tabpanel">
                            <!-- Row start -->
                            <div class="row gx-3">
                              <div class="col-12">
                                <div class="table-responsive">
                                  <table class="table align-middle m-0">
                                    <thead>
                                      <tr>
                                        <th>Bank Name</th>
                                        <th>Card Number</th>
                                        <th>Card type</th>
                                        <th>Expiry Date</th>
                                        <th>Credit Balance</th>
                                        <th>Actions</th>
                                      </tr>
                                    </thead>
                                    <tbody>
                                      <tr>
                                        <td>Bank of America</td>
                                        <td>0000 0000 0000 0000</td>
                                        <td>Visa</td>
                                        <td>10/10/2025</td>
                                        <td>$100000</td>
                                        <td>
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="cardActive">
                                          </div>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td>Citi Group</td>
                                        <td>0000 0000 0000 0000</td>
                                        <td>Master</td>
                                        <td>02/24/2028</td>
                                        <td>$150000</td>
                                        <td>
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="cardActive2" checked />
                                          </div>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td>Capital One</td>
                                        <td>0000 0000 0000 0000</td>
                                        <td>Visa</td>
                                        <td>05/05/2025</td>
                                        <td>$50000</td>
                                        <td>
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="cardActive3" checked />
                                          </div>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td>Axix</td>
                                        <td>0000 0000 0000 0000</td>
                                        <td>Visa</td>
                                        <td>08/20/2027</td>
                                        <td>$100000</td>
                                        <td>
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="cardActive4" checked />
                                          </div>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td>HDFC</td>
                                        <td>0000 0000 0000 0000</td>
                                        <td>Visa</td>
                                        <td>05/08/2029</td>
                                        <td>$90000</td>
                                        <td>
                                          <div class="form-check form-switch m-0">
                                            <input class="form-check-input" type="checkbox" role="switch"
                                              id="cardActive5">
                                          </div>
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </div>
                              </div>
                            </div>
                            <!-- Row end -->
                          </div>
                        </div>
                        <div class="d-flex gap-2 justify-content-end">
                          <button type="button" class="btn btn-outline-secondary">
                            Cancel
                          </button>
                          <button type="button" class="btn btn-success">
                            Update
                          </button>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <!-- Row end -->
            </div>
          </div>
          <!-- Content wrapper end -->

        </div>
        <!-- Content wrapper scroll end -->

        <!-- App Footer start -->
        <div class="app-footer">
          <span>© Bootstrap Gallery 2024 By <a href="https://www.bootstrapmb.com">bootstrapMB</a></span>
        </div>
        <!-- App footer end -->

      </div>
      <!-- Main container end -->

    </div>
    <!-- Page wrapper end -->

    <!-- *************
			************ Required JavaScript Files *************
		************* -->
    <!-- Required jQuery first, then Bootstrap Bundle JS -->
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/bootstrap.bundle.min.js"></script>
    <script src="assets/js/modernizr.js"></script>
    <script src="assets/js/moment.js"></script>

    <!-- *************
			************ Vendor Js Files *************
		************* -->

    <!-- Overlay Scroll JS -->
    <script src="assets/vendor/overlay-scroll/jquery.overlayScrollbars.min.js"></script>
    <script src="assets/vendor/overlay-scroll/custom-scrollbar.js"></script>

    <!-- News ticker -->
    <script src="assets/vendor/newsticker/newsTicker.min.js"></script>
    <script src="assets/vendor/newsticker/custom-newsTicker.js"></script>

    <!-- Date Range JS -->
    <script src="assets/vendor/daterange/daterange.js"></script>
    <script src="assets/vendor/daterange/custom-daterange.js"></script>

    <!-- Dropzone JS -->
    <script src="assets/vendor/dropzone/dropzone.min.js"></script>

    <!-- Main Js Required -->
    <script src="assets/js/main.js"></script>
  </body>

</html>
